<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<link href="<c:url value='/css/easyui.css'/>" rel="stylesheet">
<link href="<c:url value='/css/icon.css'/>" rel="stylesheet">
<script src="<c:url value='/js/bootstrap.file-input.js'/>"></script>
<script src="<c:url value='/js/jquery.min.js'/>"></script>
<script type="text/javascript"
	src="<c:url value='/js/jquery.easyui.min.js'/>"></script>
<script src="<c:url value='/js/checkFile.js'/>"></script>
<script src="<c:url value='/js/method_component_lib.js'/>"></script>
<script src="<c:url value='/js/add_method_component.js'/>"></script>
<div class="page-header">
	<h3 style="margin-top: auto">新增功能函数组件</h3>
</div>
<div class="row-fluid">
	<div>
		<form class="form-horizontal"
			action="<%=request.getContextPath()%>/component/method_component/add"
			method="POST" enctype="multipart/form-data" onsubmit="return valid();">
			<div class="control-group" id="div_name">
				<label class="control-label">名称</label>
				<div class="controls">
					<input type="text" placeholder="名称" name="name" id="name">
					<span class="help-inline" id="help_name">英文</span>
				</div>
			</div>
			<div class="control-group">
				<label class="control-label">版本</label>
				<div class="controls">
					<input type="text" placeholder="版本" name="version">
				</div>
			</div>
			<div class="control-group">
				<label class="control-label">描述信息</label>
				<div class="controls">
					<textarea rows="3" class="input-xxlarge" placeholder="描述信息"
						id="description" name="description"></textarea>
				</div>
			</div>
			<div class="control-group">
				<label class="control-label">实现接口</label>
				<div class="controls">
					<select style="width: 200px" name="interface_id" id="interface_id">
						<option value="0">未选择</option>
						<c:choose>
							<c:when test="${!empty list}">
								<c:forEach items="${list}" var="item">
									<option value="${item.id}">
										<c:out value="${item.name}" />
									</option>
								</c:forEach>

							</c:when>
						</c:choose>
					</select>
				</div>
			</div>
			<div class="control-group">
				<label class="control-label">依赖文件</label>
				<div id="depend_list"></div>
				<div class="controls">
					<button type="button" class="btn"
						id="btn_add_dependence" onclick="click_add_dependence()"><i class="icon-plus"></i>&nbsp;添加依赖文件（已上传）</button>
				</div>
			</div>
			<div class="control-group">
				<label class="control-label">依赖组件</label>
				<div id="depend_com_list"></div>
				<div class="controls">
					<button type="button" class="btn"
						id="btn_add_dependence_com" onclick="click_add_dependence_com()"><i class="icon-plus"></i>&nbsp;添加依赖组件</button>
				</div>
			</div>
			<div class="control-group">
				<label class="control-label"></label>
				<div class="controls">
					<div class="btn-group" data-toggle="buttons-radio">
						<button type="button" class="btn" id="btn_submit_code"
							onclick="click_submit_code()"><i class="icon-edit"></i>&nbsp;提交代码</button>
						<button type="button" class="btn" id="btn_upload_file"
							onclick="click_upload_file()"><i class="icon-upload"></i>&nbsp;上传代码</button>
					</div>
				</div>
			</div>
			<div class="control-group" id="div_submit_code">
				<label class="control-label">实现代码</label>
				<div class="controls">
					<textarea rows="10" class="input-xxlarge" placeholder="实现代码"
						id="implement" name="implement"></textarea>
				</div>
			</div>
			<div id="div_upload_file">
				<div class="control-group">
					<label class="control-label">提示:</label>
					<div class="controls">
						<p class="control-label" style="width:auto">上传文件大小的总和不能超过4M</p>
					</div>
				</div>
				
				<div class="control-group">
					<label class="control-label">头文件</label>
					<div id="head_list"></div>
					<div class="controls">
						<button type="button" class="btn"
							id="btn_add_head_file" onclick="show_add_head_file()"><i class="icon-plus"></i>&nbsp;添加.h头文件</button>
					</div>
				</div>

				<div class="control-group">
					<label class="control-label">源文件</label>
					<div id="src_list"></div>
					<div class="controls">
						<button type="button" class="btn"
							id="btn_add_src_file" onclick="show_add_src_file()"><i class="icon-plus"></i>&nbsp;添加.c源文件</button>
					</div>
				</div>
			</div>
			<div class="control-group">
				<div class="controls">
					<button type="submit" class="btn" id="submit"><i class="icon-ok"></i>&nbsp;提交</button>
					<button type="button" class="btn" style="margin-left: 50px;"  onclick="history.back()"><i class="icon-remove"></i>&nbsp;取消</button>
					<!-- <button type="button" class="btn" style="margin-left: 50px;"  onclick="valid()"><i class="icon-remove"></i>&nbsp;check</button> -->
				</div>
			</div>

		</form>
	</div>
</div>
<!--/row-->
<div id="dependDlg" class="easyui-dialog" title="已上传文件列表"
	style="width: 800px; height: auto; padding: 10px" closed="false"
	data-options="iconCls: 'icon-search-dialog'">
	<div>
		<div class="input-append">
			<input style="width: 300px" type="text" id="search_name">
			<button class="btn" type="button" onclick="search_file_list()"><i class="icon-search"></i>&nbsp;检索</button>
		</div>
		<table class="table table-hover" id="file_list">
			<thead>
				<tr>
					<th>选择</th>
					<th>类型</th>
					<th>名称</th>
					<th>所属组件名称</th>
				</tr>
			</thead>
			<tbody>
			</tbody>
		</table>
	</div>
		<div id="dlg-buttons" style="float: right;">
			<a href="javascript:void(0)" class="easyui-linkbutton"
				iconCls="icon-ok-dialog" onclick="dlgOK()">确定</a> <a
				href="javascript:void(0)" class="easyui-linkbutton"
				iconCls="icon-cancel-dialog" onclick="dlgCancel()">取消</a>
		</div>
		<script type="text/javascript">
			$(function() {
				$('#dependDlg').dialog('close');
			});
			function dlgOK(){
				$('#dependDlg').dialog('close');
                select_files();
			}
			function dlgCancel(){
				$('#dependDlg').dialog('close');
                cancel_file_list();
			}
		</script>
<div id="dependComDlg" class="easyui-dialog" title="功能函数组件列表"
	style="width: 800px; height: auto; padding: 10px" closed="false"
	data-options="iconCls: 'icon-search-dialog'">
	<div>
		<table class="table table-hover" id="com_list">
			<thead>
				<tr>
					<th width="15%">选择</th>
					<th width="60%">名称</th>
					<th width="25%">创建者</th>
				</tr>
			</thead>
			<tbody>
			<c:choose>
				<c:when test="${!empty comList}">
					<c:forEach items="${comList}" var="list" varStatus="s">
						<tr>
							<td id='td_id'><input type='checkbox' id='depId' name='depId' value="${list.id}"></td>
							<td id='td_name'><a rel="tooltip" href="javascript:void(0);" data-toggle="tooltip" data-placement="top" title="${list.description}"><c:out value="${list.name}" /></a></td>
							<td><c:choose>
									<c:when test="${!empty list.owner}">
										<c:out value="${list.owner.realname}" />
									</c:when>
								</c:choose>
							</td>
						</tr>
					</c:forEach>
				</c:when>
				<c:otherwise>
					<h3 style="margin-top: auto">数据库暂无相关功能函数组件</h3>
				</c:otherwise>
			</c:choose>
			</tbody>
		</table>
	</div>
		<div id="dlg-buttons-com" style="float: right;">
			<a href="javascript:void(0)" class="easyui-linkbutton"
				iconCls="icon-ok-dialog" onclick="dlgComOK()">确定</a> <a
				href="javascript:void(0)" class="easyui-linkbutton"
				iconCls="icon-cancel-dialog" onclick="dlgComCancel()">取消</a>
		</div>
		<script type="text/javascript">
			$(function() {
				$('#dependComDlg').dialog('close');
			});
			function dlgComOK(){
				$('#dependComDlg').dialog('close');
				select_dep_coms();
			}
			function dlgComCancel(){
				$('#dependComDlg').dialog('close');
			}
		</script>